<template>
  <div style="padding: 36px">
    评论管理

    <el-card :class="['box', 'b1']"></el-card>
    <el-card :class="['box', 'b2']"></el-card>
    <el-card :class="['box', 'b3']"></el-card>
    <el-card :class="['box', 'b4']"></el-card>

    评论管理

    <br />

    <p>这是一段文字 djasjd class="" 哈哈哈</p>
  </div>
</template>

<script>
export default {
  mounted() {
    let h = window.innerHeight
    console.log(`可视高度:${h}`)
  }
}
</script>

<style lang="less" scoped>
.box {
  height: 100px;
  width: 200px;
}

.b1 {
  background-color: aqua;
}
.b2 {
  background-color: brown;
  // display: none;
  // visibility: hidden;
}
.b3 {
  background-color: burlywood;
  width: 0;
  height: 0;
  border-top: 50px solid red;
  border-right: 50px solid transparent;
  border-left: 50px solid transparent;
}
.b4 {
  background-color: rebeccapurple;
}

p::before {
  content: '第一章：';
}
p::after {
  content: 'Hot!';
}
p::first-line {
  background: red;
}
p::first-letter {
  font-size: 30px;
}
</style>
